<template>
    <div class="user-setting">
        <basic-container>
            <!--发送手机号弹框-->
            <el-dialog
                    :title=inputMessage
                    :visible.sync="dialogOpenByPhone"
                    size="70%"
                    :close-on-click-modal="false"
                    :show-close="false"
                    @open = "open">
                <el-form v-if="!testPhoneMesCodePass || isChangeRelationPhone" :rules="rulesPhoneNum" :model="objCheckPhone" ref="checkPhoneTest" label-width="214px"
                         class="demo-ruleForm">


                    <el-form-item v-if="testPhoneMesCodePass && isChangeRelationPhone" prop="phone" label="请输入新的手机号"style="width:50%;display: inline-block; margin-left: 10px">
                        <el-input v-model="objCheckPhone.phone" @input="change($event)" placeholder="请输入手机号"></el-input>
                    </el-form-item>

                    <el-form-item :label="objCheckPhone.phoneInfo" style="width:74%;display: inline-block; margin-left: 10px">
                        <el-input v-model="objCheckPhone.phoneCode" @input="change($event)" placeholder="请输入短信验证码"></el-input>
                    </el-form-item>

                    <!--用于修改绑定的手机号 开始-->
                    <el-button v-if="testPhoneMesCodePass && !isOpenAgain && isChangeRelationPhone" @click="VerificationCodeUsedP" type="primary"
                               :disabled="!isCanClickSendPhoneCodeUsedP" style="margin-left: 10px">{{sendMessageInfoUsedRelationP}}
                    </el-button>
                    <el-button v-if="testPhoneMesCodePass && isOpenAgain && isChangeRelationPhone" @click="VerificationCodeOther" type="primary"
                               style="margin-left: 10px">{{sendMessageInfoOther}}
                    </el-button>
                    <!--用于修改绑定的手机号 结束-->

                    <!--通用于第一次打开的弹框-->
                    <el-button v-if="!testPhoneMesCodePass && !isOpenAgain " @click="VerificationCode" type="primary"
                               :disabled="!isCanClickSendPhoneCode" style="margin-left: 10px">{{sendMessageInfo}}
                    </el-button>
                    <el-button v-if="!testPhoneMesCodePass && isOpenAgain" @click="VerificationCodeOther" type="primary"
                               style="margin-left: 10px">{{sendMessageInfoOther}}
                    </el-button>
                </el-form>

                <el-form v-if="testPhoneMesCodePass && !isChangeRelationPhone" :rules="rules" :model="objCheckPhoneInfo" ref="checkPhone"
                         label-width="214px" class="demo-ruleForm">
                    <el-form-item :label="pleaseInputSth" prop="newPayPwd" style="width:74%;display: inline-block; margin-left: 10px">
                        <el-input v-model="objCheckPhoneInfo.newPayPwd" @input="change($event)" :placeholder="pleaseInputSth" show-password></el-input>
                    </el-form-item>
                    <el-form-item :label="pleaseAgainInputSth" prop="newAgainPayPwd" style="width:74%;display: inline-block; margin-left: 10px">
                        <el-input v-model="objCheckPhoneInfo.newAgainPayPwd" @input="change($event)" :placeholder="pleaseAgainInputSth" show-password></el-input>
                    </el-form-item>
                </el-form>

                <div style="margin: 50px auto;">
                    <div style="width:200px;margin: 0px auto;">
                        <el-button v-if="!testPhoneMesCodePass" type="primary" size="mini" @click="sureData">确 定</el-button>
                        <el-button v-if="isChangeRelationPhone && testPhoneMesCodePass " type="primary" size="mini" @click="changePhoneNum" :loading="loadBtnPhone">修 改</el-button>
                        <el-button v-if="testPhoneMesCodePass && !isChangeRelationPhone" type="primary" size="mini"
                                   @click="commitDataChangePwdPhoneCode" :loading="loadBtn">提 交</el-button>
                        <el-button size="mini" @click="cancelDialog">取 消</el-button>
                    </div>
                </div>
            </el-dialog>

            <el-dialog
                    title="填写图片验证码"
                    :visible.sync="dialogOpenPictureCode"
                    size="70%"
                    :close-on-click-modal="false"
                    :show-close="false">
                <el-form :model="objCheckPictureCode" ref="pictureCode" label-width="230-px" class="demo-ruleForm">
                    <el-form-item label="请输入图片验证码" style="width:50%;display: inline-block; margin-left: 10px">
                        <el-input v-model="objCheckPictureCode.pictureCode" @input="change($event)" placeholder="请输入验证码"></el-input>
                    </el-form-item>
                    <el-image :src="codeImg" @click="changeImage" style="float:right;" alt="Loading..."/>
                    <!--<image @click="changeImage" slot="button" width="1.8rem" height="0.8rem" :src="codeImg" />-->
                </el-form>

                <div style="margin: 50px auto;">
                    <div style="width:200px;margin: 0px auto;">
                        <el-button type="primary" size="mini" @click="sendPhoneCode">发 送</el-button>
                        <el-button size="mini" @click="cancelPictureCodeDialog">取 消</el-button>
                    </div>
                </div>
            </el-dialog>

        </basic-container>
    </div>
</template>

<script>
    import {
        getAllUserInfo,
        getMsgCode,                         //发送验证码
        getImageVerification,               //获取图片验证码
        testChangPwdByPhoneMsgCode,         //(通过手机号修改支付密码时用到)校验手机号发送的验证码
        changePwdByPhoneNumber,              //通过手机号修改卖家用户类型为店铺用户的支付密码
        changeUserPwdByPhoneNumber,          //通过手机号修改卖家用户类型为个人用户的支付密码
        changeAccountPwdByPhoneNumber,      //通过手机号修改账号密码
        changePhone                         //修改绑定的手机号
    } from "@/api/user";
    import ElSlPanel from "element-ui/packages/color-picker/src/components/sv-panel";
    import { baseUrl} from "../../config/env";
    import { getToken } from '@/util/store';

    export default {
        props: ["whichWay","useType"],
        components: {ElSlPanel},
        data() {
            return {
                inputMessage:"输入验证码",
                loadBtn:false,                                            //通过手机号修改支付/账户等密码的提交状态
                loadBtnPhone:false,                                       //修改绑定的手机号提交状态
                times: 60,
                timer: null,
                value: true,
                dialogOpenByPhone: false,                                 //发送手机号弹框
                objCheckPhone:{},                                         //用于绑定填写获取的手机验证码
                codeImg: '',                                              //动态的获取图片验证码
                dialogOpenPictureCode: false,                            //填写图片验证码弹框
                objCheckPictureCode: {
	                pictureCode:''
                },                                  //获取填写的图片验证码
                sendMessageInfo: '发送验证码',                            //通用的
                sendMessageInfoOther: '发送验证码',                       //通用的
                sendMessageInfoUsedRelationP: '发送验证码',               //用于修改绑定的手机号(专用)
                testPhoneMesCodePass: false,                             //验证手机号验证码是否正确
                account: '',                                             //用户手机号
                isOpenAgain: false,                                     //是否重新打开修改手机号弹框
                isCanClickSendPhoneCode: true,                          //是否可以点击"发送验证码",如果是正在倒计时中，则不可以点击
                isCanClickSendPhoneCodeUsedP: true,                     //是否可以点击"发送验证码",如果是正在倒计时中，则不可以点击(专用于修改绑定的手机号)
                objCheckPhoneInfo: {
                    newPayPwd:'',
                    newAgainPayPwd:''
                },                                  //获取通过填写手机短信发送的验证码后填写的新的支付密码
                isChangePwd:false,                                      //传过来的数据是否是修改密码
                isChangePayPwd:false,                                   //传过来的数据是否是修改支付密码
                pleaseInputSth:"请输入密码",                             //用于input标签的动态展示
                pleaseAgainInputSth:"请再次输入密码",                    //用于input标签的动态展示
                isChangeRelationPhone:false,                            //是否用于修改绑定的手机号
                isClickSendPhoneCodeBtn:false,                           //是否点击过"发送"按钮"，专门用于不填写图片验证码直接填写手机验证码，点击确定的情况
                rules: {
                    newPayPwd: [
                        {required: true, message: '请输入新密码', trigger: 'blur'},
                    ],
                    newAgainPayPwd: [
                        {required: true, message: '请再次输入新密码', trigger: 'blur'},
                    ]
                },
                rulesPhoneNum:{
                    phone:[{
                        required: true,
                    }]
                }
            }
        },

        watch: {
            useType: {
                handler(newValue, oldValue) {
                   this.useType = newValue;
                },
            },
            whichWay: {
                handler(newValue, oldValue) {
                    this.whichWay = newValue;
                },
            }
        },

        methods: {
			change(){
				this.$forceUpdate()
			},
            open(){
                console.log(this.useType);
                console.log(this.whichWay);
                if(this.whichWay == "changRelationPhone"){
                    this.isChangeRelationPhone = true;
                }
                else{

                    this.isChangeRelationPhone = false;

                    if(this.whichWay =="changPwdByPhone"){
                        this.isChangePwd =true;
                        this.isChangePayPwd = false;
                        this.pleaseInputSth = "请输入密码";
                        this.pleaseAgainInputSth = "请再次输入密码" ;
                    }
                    else if(this.whichWay == "changPayPwdByPhone"){
                        this.isChangePwd =false;
                        this.isChangePayPwd = true;
                        this.pleaseInputSth = "请输入支付密码";
                        this.pleaseAgainInputSth = "请再次输入支付密码" ;
                    }
                    else if(this.whichWay == "forgetPwdAndChange"){
                        this.pleaseInputSth = "请输入支付密码";
                        this.pleaseAgainInputSth = "请再次输入支付密码" ;
                    }
                }

                // 倒计时中
                if (this.times <= 60 && this.times >= 0) {
                    if (this.times == 0 || this.times == 60) {
                        this.isOpenAgain = false;
                    }
                    else {
                        this.isOpenAgain = true;
                    }
                }
                //获取用户信息
                getAllUserInfo().then(res => {
                    let userPhone = res.data.data.phone.slice(7);
                    this.account = res.data.data.phone;
                    this.objCheckPhone.phoneInfo = "输入手机尾号" + userPhone + "接收的验证码";
                    this.dialogOpenByPhone =true
                })
            },
            //60秒倒计时
            countdown() {
                this.timer = setInterval(() => {
                    if (this.times <= 60 && this.times >= 0) {
                        this.$nextTick(() => {
                            this.message = `${this.times--}s`;
                        })
                        if (this.times != 0) {
                            this.sendMessageInfo = '重新发送' + this.times
                            this.isCanClickSendPhoneCode = false;
                        }
                        else {
                            this.sendMessageInfo = '发送验证码';
                            //倒计时已结束，将已成功发送图片验证码设置为false
                            this.isCanClickSendPhoneCode = true
                        }
                    } else {
                        clearInterval(this.timer);
                        this.sendMessageInfo = `发送验证码`;
                        this.times = 60;
                        //倒计时已结束，将已成功发送图片验证码设置为false
                        this.isCanClickSendPhoneCode = true
                    }
                }, 1000)
            },

            //点击发送验证码(按钮显示“发送验证码”的时候能调用此方法)
            VerificationCode() {
                //是否可以点击"发送手机号验证码弹框"的”发送验证码接口“
                if (this.isCanClickSendPhoneCode) {
                    this.dialogOpenPictureCode = true;
                    //调用获取图片验证码接口
                    this.changeImage()
                }
            },
            VerificationCodeUsedP(){
                //是否可以点击"发送手机号验证码弹框"的”发送验证码接口“
                if(this.objCheckPhone.phone){
                    if (this.isCanClickSendPhoneCodeUsedP) {
                        this.dialogOpenPictureCode = true;
                        //调用获取图片验证码接口
                        this.changeImage()
                    }
                }
                else{
                    this.$message({
                        message: "输入的手机号不能为空",
                        type: 'error'
                    });
                }
            },
            VerificationCodeOther() {
                if (this.times <= 60 && this.times >= 0) {
                    if (this.times == 0 || this.times == 60) {
                        this.isOpenAgain = false;
                    }
                    else {
                        this.isOpenAgain = true;
                    }
                }

                this.$message({
                    message: "一分钟内已经发送过验证码",
                    type: 'error'
                });
                return;
            },
            //验证通过手机发送的验证码
            sureData() {
                console.log(this.isClickSendPhoneCodeBtn);
                if(!this.isClickSendPhoneCodeBtn){
                    this.$message({
                        type: "error",
                        message: "请先完成'发送验证码'那一步"
                    });
                    return;
                }
                if (this.account && this.objCheckPhone.phoneCode && this.useType) {
                    testChangPwdByPhoneMsgCode(this.account, this.objCheckPhone.phoneCode, this.useType).then(res => {
                        if (res.data.code == 500) {
                            this.testPhoneMesCodePass = false;
                            this.$message({
                                message: res.data.message,
                                type: 'error'
                            });
                            return;
                        } else if (res.data.code == 200) {
                            this.testPhoneMesCodePass = true;
                            this.inputMessage = "请输入密码";
                            if(this.isChangeRelationPhone){
                                this.objCheckPhone.phoneCode = '';
                            }
                        }
                    });
                }
                else {
                    this.$message({
                        type: "error",
                        message: "您还没有输入验证码"
                    });
                    return;
                }
            },

            //修改手机号调用的接口
            changePhoneNum(){
                this.loadBtnPhone =true;
                if (this.objCheckPhone.phone && this.account && this.objCheckPhone.phoneCode && this.useType) {
                    let testPhone = this.testPhone(this.objCheckPhone.phone);
                    if(testPhone){
                        let data={
                            newPhone:this.objCheckPhone.phone,
                            oldPhone:this.originalPhone,
                            msgCode:this.objCheckPhone.phoneCode,
                            useType:this.useType
                        }
                        changePhone(data).then(res => {
                            if (res.data.code == 500) {
                                this.loadBtnPhone =false;
                                this.testPhoneMesCodePass = true;
                                this.dialogOpenByPhone = true;
                                this.$message({
                                    message: res.data.message,
                                    type: 'error'
                                });
                                return;
                            } else if (res.data.code == 200) {
                                this.loadBtnPhone =false;
                                this.testPhoneMesCodePass = false;
                                if(this.objCheckPhone.phoneCode){
                                    this.objCheckPhone.phoneCode = '';
                                }
                                this.dialogOpenByPhone = false;
                                this.$message({
                                    type: 'success',
                                    message: '操作成功!'
                                })
                            }
                        });
                    }
                    else{
                        this.loadBtnPhone =false;
                        this.$message({
                            type: "error",
                            message: "输入的手机号不符合标准"
                        });
                    }

                }
                else {
                    this.loadBtnPhone =false;
                    this.$message({
                        type: "error",
                        message: "输入的有空值"
                    });
                }
            },

            //校验输入的手机号
            testPhone(value){
                let testPhoneFlag = false;
                let newValue= value.replace(/\s*/g,"");
                const re = /^1[3|4|5|7|8][0-9]{9}$/;
                const rsCheck = re.test(newValue);
                if(rsCheck){
                    return testPhoneFlag = true
                }
                else{
                    return testPhoneFlag = false
                }
            },

            //通过了验证手机号发送的验证码后，提交数据更改相应的密码
            commitDataChangePwdPhoneCode() {
                this.loadBtn = true;
                if (this.objCheckPhoneInfo.newPayPwd && this.account && this.objCheckPhone.phoneCode && this.useType) {
                    //校验输入的密码以及再次输入的密码
                        if (this.objCheckPhoneInfo.newPayPwd == this.objCheckPhoneInfo.newAgainPayPwd) {
                            if(this.isChangePwd){
                                //校验账号密码
                                let newPwdTest= this.testPwd(this.objCheckPhoneInfo.newPayPwd)
                                let newPwdAgainTest= this.testPwd(this.objCheckPhoneInfo.newAgainPayPwd)
                                if(newPwdTest && newPwdAgainTest){
                                    //修改的是账号密码
                                    changeAccountPwdByPhoneNumber(this.objCheckPhoneInfo.newPayPwd, this.account, this.objCheckPhone.phoneCode, this.useType).then(res => {
                                        if (res.data.code == 500) {
                                            this.loadBtn = false;
                                            this.$message({
                                                message: res.data.message,
                                                type: 'error'
                                            });
                                            return;
                                        } else if (res.data.code == 200) {
                                            this.loadBtn = false;
                                            if(this.isChangeRelationPhone){
                                                this.testPhoneMesCodePass = true;
                                            }
                                            else{
                                                this.testPhoneMesCodePass = false;
                                            }
                                            this.dialogOpenByPhone = false;
                                            if(this.objCheckPhone.phoneCode){
                                                this.objCheckPhone.phoneCode = "";
                                            }
                                            if(this.objCheckPhoneInfo.newPayPwd){
                                                this.objCheckPhoneInfo.newPayPwd = "";
                                            }
                                            if(this.objCheckPhoneInfo.newAgainPayPwd){
                                                this.objCheckPhoneInfo.newAgainPayPwd = "";
                                            }
                                            this.inputMessage = "请输入验证码";
                                            //停止倒计时
                                            clearInterval(this.timer);
                                            this.sendMessageInfo = `发送验证码`;
                                            this.times = 60;
                                            //倒计时已结束，将已成功发送图片验证码设置为false
                                            this.isCanClickSendPhoneCode = true
                                            this.$store.dispatch("LogOut");//退出登录
                                        }
                                    });
                                }
                            else {
                                   this.loadBtn = false;
                                    this.$message({
                                        type: "error",
                                        message: "密码为6-20为数字字母的组合,不能包含特殊符号"
                                    });
                                }
                            }
                            else{
                                //校验支付密码
                                let newPwdTest= this.testPayPwd(this.objCheckPhoneInfo.newPayPwd)
                                let newPwdAgainTest= this.testPayPwd(this.objCheckPhoneInfo.newAgainPayPwd)
                                if(newPwdTest && newPwdAgainTest){
                                    if(this.useType == "change_pay_pwd"){
                                        //修改的是卖家用户类型为店铺类型用户的支付密码
                                        changePwdByPhoneNumber(this.objCheckPhoneInfo.newPayPwd, this.account, this.objCheckPhone.phoneCode, this.useType).then(res => {
                                            if (res.data.code == 500) {
                                                this.loadBtn = false;
                                                this.$message({
                                                    message: res.data.message,
                                                    type: 'error'
                                                });
                                                return;
                                            } else if (res.data.code == 200) {
                                                this.loadBtn = false;
                                                if(this.isChangeRelationPhone){
                                                    this.testPhoneMesCodePass = true;
                                                }
                                                else{
                                                    this.testPhoneMesCodePass = false;
                                                }
                                                this.dialogOpenByPhone = false;
                                                if(this.objCheckPhone.phoneCode){
                                                    this.objCheckPhone.phoneCode = "";
                                                }
                                                if(this.objCheckPhoneInfo.newPayPwd){
                                                    this.objCheckPhoneInfo.newPayPwd = "";
                                                }
                                                if(this.objCheckPhoneInfo.newAgainPayPwd){
                                                    this.objCheckPhoneInfo.newAgainPayPwd = "";
                                                }
                                                this.inputMessage = "请输入验证码";
                                                //停止倒计时
                                                clearInterval(this.timer);
                                                this.sendMessageInfo = `发送验证码`;
                                                this.times = 60;
                                                //倒计时已结束，将已成功发送图片验证码设置为false
                                                this.isCanClickSendPhoneCode = true

                                                this.$message({
                                                    type: 'success',
                                                    message: '操作成功!'
                                                })
                                            }
                                        });
                                    }
                                    else if(this.useType == "change_user_pay_pwd"){
                                        //修改的是卖家用户类型为个人用户的支付密码
                                        changeUserPwdByPhoneNumber(this.objCheckPhoneInfo.newPayPwd, this.account, this.objCheckPhone.phoneCode, this.useType).then(res => {
                                            if (res.data.code == 500) {
                                                this.loadBtn = false;
                                                this.$message({
                                                    message: res.data.message,
                                                    type: 'error'
                                                });
                                                return;
                                            } else if (res.data.code == 200) {
                                                this.loadBtn = false;
                                                if(this.isChangeRelationPhone){
                                                    this.testPhoneMesCodePass = true;
                                                }
                                                else{
                                                    this.testPhoneMesCodePass = false;
                                                }
                                                this.dialogOpenByPhone = false;
                                                if(this.objCheckPhone.phoneCode){
                                                    this.objCheckPhone.phoneCode = "";
                                                }
                                                if(this.objCheckPhoneInfo.newPayPwd){
                                                    this.objCheckPhoneInfo.newPayPwd = "";
                                                }
                                                if(this.objCheckPhoneInfo.newAgainPayPwd){
                                                    this.objCheckPhoneInfo.newAgainPayPwd = "";
                                                }

                                                //停止倒计时
                                                clearInterval(this.timer);
                                                this.sendMessageInfo = `发送验证码`;
                                                this.times = 60;
                                                //倒计时已结束，将已成功发送图片验证码设置为false
                                                this.isCanClickSendPhoneCode = true

                                                this.$message({
                                                    type: 'success',
                                                    message: '操作成功!'
                                                })
                                            }
                                        });
                                    }
                                }
                            else {
                                    this.loadBtn = false;
                                    this.$message({
                                        type: "error",
                                        message: "支付密码为6位纯数字"
                                    });
                                }
                            }
                        }
                        else {
                            this.loadBtn = false;
                            this.$message({
                                type: "error",
                                message: "两次输入的数据不一致"
                            });

                        }
                }
                else {
                    this.loadBtn = false;
                    this.$message({
                        type: "error",
                        message: "输入的不能有空值"
                    });
                }
            },
            //校验输入的密码
            testPwd(value){
                let testPwdFlag = false;
                if(value!=0){
                    if (!value) {
                        return testPwdFlag = false;
                    }
                }

                let newValue= value.replace(/\s*/g,"");
                const re = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,20}$/;
                const test = re.test(newValue);
                if(test){
                    return testPwdFlag = true ;
                }
                else {
                    return testPwdFlag = false;
                }
            },
            //校验输入的支付密码
            testPayPwd(value){
                let testPayPwdFlag = false;
                if(value!=0){
                    if (!value) {
                        return testPayPwdFlag = false;
                    }
                }
                let newValue= value.replace(/\s*/g,"");
                const re = /^\d{6}$/;  //这是校验支付密码是6位纯数字
                const test = re.test(newValue);
                if(test){
                    return testPayPwdFlag = true;
                }
                else {
                    return testPayPwdFlag = false;
                }
            },

            //输入通过手机号发送的验证码之后点击确定按钮
            sendPhoneCode() {
                //如果填写的图片验证码不为空
                if (this.objCheckPictureCode.pictureCode) {
                    var data1 = {};
                    data1.useType = this.useType
                    data1.imageVerifyCode = this.objCheckPictureCode.pictureCode;
                    data1.phone = this.account;
                    getMsgCode(data1).then((res) => {
                        //暂时先注释掉
                        if (res.data.code == 500) {
                            this.isCanClickSendPhoneCode = true;
                            this.isClickSendPhoneCodeBtn = false;
                            this.$message.error(res.data.message);
                            this.changeImage()
                        } else if(res.data.code == 200){
                            //开始倒计时
                            this.isCanClickSendPhoneCode = false;
                            this.dialogOpenPictureCode = false;
                            this.objCheckPictureCode.pictureCode = "";
                            if(this.objCheckPhone.phoneCode){
                                this.objCheckPhone.phoneCode = '';
                            }

                            this.isClickSendPhoneCodeBtn = true;
                            this.$message({
                                type: 'success',
                                message: '验证码已发送，请耐心等待!'
                            })
                            this.countdown()
                        }
                    })
                }
                else {
                    //错误提示，没填写图片验证码
                    this.$message({
                        type: "error",
                        message: "请填写图片验证码"
                    });
                }
                console.log(this.objCheckPictureCode.pictureCode)
            },
            //填写通过手机号发送的验证码弹框关闭
            cancelDialog() {
                if (this.testPhoneMesCodePass) {
                    this.objCheckPhoneInfo.newPayPwd = "";
                    this.objCheckPhoneInfo.newAgainPayPwd = "";
                }
                this.dialogOpenByPhone = false;
                this.testPhoneMesCodePass = false;
                if(this.objCheckPhone.phoneCode){
                    this.objCheckPhone.phoneCode = "";
                }
                this.inputMessage = "请输入验证码";
            },
            //填写图片验证码弹框关闭
            cancelPictureCodeDialog() {
                this.dialogOpenPictureCode = false;
                this.isClickSendPhoneCodeBtn = false;
                this.objCheckPictureCode.pictureCode = "";
            },
            changeImage() {
	            fetch(`${baseUrl}api/authService/getImageVerification?phone=${this.account}`,{
		            method: 'get',
			        responseType: 'blob'
	            })
                .then((response) => {
	                return response.blob()
                })
                .then((blob) => {
	                const srcs = new Blob([blob], {
		                type: 'image/jpeg'
	                })
	                this.codeImg = URL.createObjectURL(srcs)
                })
                .catch((error) => {
                    alert(error)
                })

                // getImageVerification(this.account).then(res => {
	            //     let reader = new window.FileReader();
	            //     const srcs = res.data.blob()
	            //     reader.readAsArrayBuffer(srcs);
	            //     reader.onload = function (e) {
		        //         const result = e.target.result
		        //         const contentType = srcs.type
		        //         // 生成blob图片,需要参数(字节数组, 文件类型)
		        //         const blob = new Blob([result], { type: contentType })
		        //         // 使用 Blob 创建一个指向类型化数组的URL, URL.createObjectURL是new Blob文件的方法,可以生成一个普通的url,可以直接使用,比如用在img.src上
		        //         const url = window.URL.createObjectURL(blob)
		        //         console.log(url) // 产生一个类似 blob:d3958f5c-0777-0845-9dcf-2cb28783acaf 这样的URL字符串
	            //     }
                // })
            }
        }
    }
</script>

<style lang="scss">
    .user-setting {
        &__main {
            padding: 8px 40px;
        }
        &__item {
            -webkit-box-align: center;
            -ms-flex-align: center;
            align-items: center;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            padding: 12px 0;
            border-bottom: 1px solid #eee;
        }
        &__title {
            font-size: 20px;
            color: rgba(0, 0, 0, 0.85);
            line-height: 28px;
            font-weight: 500;
            margin-bottom: 12px;
        }
        &__meta {
            flex: 1;
            .title {
                margin: 6px 0;
                font-weight: 700;
                font-size: 14px;
            }
            .subtitle {
                margin: 8px 0;
                font-size: 14px;
                color: #555;
            }
        }
    }
</style>
